import React from 'react';
import { useLocation } from 'react-router-dom';
import './DiskSpace.css';
import DataStructureManager from '../components/DataStructureManager';

const DiskSpace: React.FC = () => {
  const location = useLocation();
  
  // 根据路径显示不同的内容
  const renderContent = () => {
    if (location.pathname === '/settings') {
      return (
        <div className="disk-content">
          <div className="page-header">
            <div className="breadcrumb">系统设置 &gt; 运行管理</div>
          </div>
          
          <div className="system-management-container">
            <DataStructureManager />
          </div>
        </div>
      );
    } else if (location.pathname === '/disk-space/usage') {
      return (
        <div className="disk-content">
          <h2>磁盘用量</h2>
          <p>这里显示系统各磁盘的使用情况和容量分析。</p>
        </div>
      );
    } else if (location.pathname === '/disk-space/management') {
      return (
        <div className="disk-content">
          <h2>磁盘管理</h2>
          <p>这里提供磁盘管理相关功能。</p>
        </div>
      );
    } else {
      return (
        <div className="disk-content">
          <h2>磁盘空间</h2>
          <p>请从上方菜单选择您想要查看的磁盘空间信息。</p>
          <p>您可以点击"磁盘空间"查看下拉菜单中的选项。</p>
        </div>
      );
    }
  };

  return (
    <div className="disk-space-container">
      {renderContent()}
    </div>
  );
};

export default DiskSpace; 